簡介:你還在網(wǎng)上下載各種插件嗎?作為前端工程師,你是否還不了解插件怎么封裝呢,快來加入我們的課程吧,讓我們一起來學習 JS 組件的封裝。本課程通過制作一個圖片幻燈片切換效果,從而引入怎么樣一步一步把代碼封裝成組件的方法。
第1章 結構搭建
本章節(jié)對代碼效果進行了演示,及完成網(wǎng)頁的 DOM 結構的搭建工作。
第2章 JS交互
本章節(jié)講解插件封裝要素,初始化基本幻燈片展示邏輯,人機交互行為、最終實現(xiàn)一個插件。
- 視頻: 2-1 基本JS、JQ開發(fā)結構搭建 (11:04)
- 視頻: 2-2 需求分析和配置參數(shù)設置 (15:36)
- 視頻: 2-3 默認配置參數(shù)設置及擴展 (10:11)
- 視頻: 2-4 設置基本參數(shù)值 (12:17)
- 視頻: 2-5 按鈕和第一幀層級關系設置 (07:01)
- 視頻: 2-6 右邊幀的位置關系設置(1) (09:46)
- 視頻: 2-7 右邊幀的位置關系設置(2) (18:24)
- 視頻: 2-8 左邊幀的散列關系 (10:20)
- 視頻: 2-9 幀的展示方式 (06:52)
- 視頻: 2-10 左旋轉所有幀 (11:33)
- 視頻: 2-11 右旋轉所有幀 (10:37)
第3章 代碼bug處理及優(yōu)化
本章節(jié)對“快速點擊多次切換時的bug”進行了處理,及完善了組件自動播放功能,最后簡單介紹了“偶數(shù)個圖片”的處理方案。